<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>忘记密码</title>

        <meta http-equiv="X-UA-Compatible" content="IE=Edge">
        <link type="image/x-icon" rel="bookmark" href="#">
        <link type="image/x-icon" rel="shortcut icon" href="#">
        <link rel="stylesheet" href="__PUBLIC__css/common.css">
        <link rel="stylesheet" href="__PUBLIC__css/user-new.css">
        <link rel="stylesheet" href="__PUBLIC__css/login.css" type="text/css">
        <style type="text/css">
            html,body{height:100%;margin:0;padding:0;}
            #maincontent {min-height:100%;height:auto !important;height:100%;margin-bottom:-100px;}
            #footer,.push {height:140px;clear:both;}
            #showMsgBox{position:absolute;bottom:-20px;left:0%;width:100%;}
            #i-agreed{padding:0}
            .login-but{margin:8px auto;padding-bottom:20px;}
            .disabled{background-color:#AAAAAB !important;}
            #footer{background-color:#1E1B29;padding-top:15px;box-sizing: border-box}
        </style>
    </head>
    <body>
        <div id="maincontent">
            <agenttpl file='share/header_piece' />
            <!--通用栏广告位-->
            <!--通用栏广告位-->
            <div class="page-content">
                <div id="div_1" style="" class="login-box">
                    <h1><span>重设密码</span></h1>
                    <ul>
                        <li class="yz">
                            <div>
                                <input type="text" id="phone" name="phone"  maxlength="11" placeholder="请输入手机号" style="color: rgb(51, 51, 51);">
                            </div>
                            <a id="sendPhoneMesBtn" href="javascript:;">发送手机验证码</a>
                        </li>
                        <li>
                            <div>
                                <input type="text" id="verificationcode" name="code" maxlength="6" style="color: rgb(51, 51, 51);" placeholder="请输入手机验证码">
                            </div>
                        </li>
                        <li class="i-agreed">
<!--                          <div>
                            <i id="i-agreed" class="on" >我已经阅读并接受</i><a href="{:U('Front/Account/userTerms')}" target="_blank">《{:C('COMPANY_SHORTNAME')}用户协议》</a><p>请接受《{:C('COMPANY_SHORTNAME')}用户协议》</p>
                          </div>-->
                            <div id="showMsgBox"></div>
                        </li>
                    </ul>
                    <div class="login-but">
                        <a id="btn-reg-f" class="disabled" href="javascript:void(0)">下 一 步</a>
                    </div>
                </div>
                <!-- The two -->
                <div id="div_2" style="display:none;" class="login-box">
                    <h1><span>重设密码</span></h1>
                    <ul>
                        <li>
                            <div>
                                <input type="text" id="username" name="username" readonly="readonly" maxlength="20" placeholder="手机号:"  class="error">
                            </div>
                        </li>
                        <li>
                            <div>
                                <input type="password" id="password" name="password"  maxlength="20" placeholder="密码" class="error">
                            </div>
                        </li>
                        <li>
                            <div>
                                <input type="password" id="userpass" name="userpass"  maxlength="20" placeholder="确认密码" class="error">
                            </div>
                        </li>
                        <li class="error-tips">手机号已验证！</li>
                    </ul>
                    <div class="login-but">
                        <a href="javascript:void(0)" id="commit" name="commit">提 交</a>
                    </div>
                </div>
                
                
                <!-- The end -->
                <div id="div_3" style="display:none;" class="registered-successful">
                    <h1><img src="__PUBLIC__img/ico_successful.png">重设密码成功！</h1>
                    <p class="gray">请妥善保管您的密码</p>
                    <a id="back" href="user_center.html" class="loading">3秒后将转向登录界面</a>
                </div>
            </div>
        </div>
        
<div class="footer">
            <p>Copyright @ 2009 - 2015  All Rights Reserved</p>
            <p>{:C('WEB_ICP')}  </p>
            <p>公司名称：{:C('COMPANY_NAME')}  电话：{:C('COMPANY_PHONE')}</p>
            <p>公司地址：{:C('COMPANY_ADDR')}</p>
        </div>
        <script src="__PUBLIC__js/jquery-1.7.2.min.js"></script>
        <script src="__PUBLIC__js/demo1.js"></script>
        <script>
        window.onload = function(){
            var getCodeBtn = $("#sendPhoneMesBtn");
            var phoneSucc = false;
            /***************验证手机号阶段*****************/
            getCodeBtn.click(f2);
            function is_valide_phone_number(phone){
                var reg = /^0?1[3|4|5|7|8][0-9]\d{8}$/;
                return reg.test(phone);
            }

            function f2(){
                var phone = $("#phone").val();
                if (phone.trim() === ""){
                    showMsg("#showMsgBox", "手机号码不能为空", "red");
                    return;
                }
                if (!is_valide_phone_number(phone)){
                    showMsg("#showMsgBox", "手机号码格式不正确", "red");
                    return;
                }

                sendData("{:U('Front/account/forgetPWDCheckPhone')}", {"phone":phone}, getCodeSucc, getCodeErr, "GET", "");
//                if(phoneSucc){
//                    showMsg("#showMsgBox","已向手机号为"+phone+"发送了一条验证码...","green");
//                }
                    $("#btn-reg-f").removeClass("disabled");
                }

                function getCodeSucc(data){
                    if (data.error === "0"){
                        _getCode("#sendPhoneMesBtn", 60, f2, 500, "#showMsgBox");
                        phoneSucc = true;
                        showMsg("#showMsgBox", data.msg, "green");
                    } else if (data.error === "1"){
                        phoneSucc = false;
                        showMsg("#showMsgBox", data.msg, "red");
                    }
                }
                function getCodeErr(data){
                    alert("数据获取失败..");
                }
            /**************下一步按钮 被单机*************/
            $("#btn-reg-f").click(function(){
                if (phoneSucc){
                    var PhoneVerifyCode = $("#verificationcode").val();
                    if (PhoneVerifyCode.trim() !== ""){
                        sendData("{:U('Front/account/forgetPWDVerifyPhoneCode')}", {"PhoneVerifyCode":PhoneVerifyCode}, verificationCodeSucc, verificationCodeErr);
                    } else{
                        showMsg("#showMsgBox", "请输入验证码", "red");
                    }
                }
            });

            function verificationCodeSucc(data){
                if (data.error === "1"){
                    showMsg("#showMsgBox", "验证码错误", "red");
                    return;
                } else if (data.error === "0"){
                    $("#div_1").hide();
                    var phone = $("#phone").val();
                    $("#username").val("用户名：" + phone);
                    $("#div_2").show();
                }
            }

            function verificationCodeErr(){
                alert("验证失败");
            }



            /*************设置密码阶段*******************/
            $("#commit").click(function(){
                var pass1 = $("#password").val();
                var pass2 = $("#userpass").val();
                if ((pass1 === pass2) && (pass1.trim() !== "")){
                    sendData("{:U('Front/account/forgetPWDcheckPass')}", {"pass1":pass1, "pass2":pass2}, sendPhoneSucc, sendPhoneErr, "GET")
                } else{
                    showMsg(".error-tips", "两次密码输入不一致", "red");
                }
            });
            function sendPhoneSucc(data){
                if (data.error === "0"){
                    $("#div_1").css("display", "none");
                    $("#div_2").css("display", "none");
                    $("#div_3").css("display", "block");
                    var i = 3;
                    var timer = setInterval(function(){
                        i--;
    //                    $("#back").html("带你熟悉{:C('COMPANY_SHORTNAME')}（" + i + "秒...）");
                        if (i < 1){
                            clearInterval(timer);
                            timer = null;
                            window.location.href = "{:U('Front/account/login')}";
                        }
                    }, 1200);
                } else if (data.error === "1"){
                    showMsg(".error-tips", data.msg, "red");
                }
            }
            function sendPhoneErr(){
                alert("提交密码失败..");
            }
        }
        </script>
        <style>
            .push{display:block;}
        </style>
    </body>
</html>